<script setup>
    import {ref,onMounted} from 'vue'
    // 生命周期函数执行多次的时候，会按照顺序依次执行
    // 1. 业务功能1
    const count = ref(100)
    onMounted(()=>{
        count.value = 1000
        console.log(111);
        
    })
    // 2. 业务功能2
    const count1 = ref(1000)
    onMounted(()=>{
        count1.value = 10000
        console.log(222);
        
    })
//     onBeforeMount(() => {
//     console.log("onBeforeMount")
//     })
//     onMounted(() => {
//         count.value++ // 数据变化
//         console.log("onMounted,此时可以获取数据操作dom")
//     })
//     onBeforeUpdate(() => {
//         console.log("更新之前,onBeforeUpdate")
//     })
//     onUpdated(() => {
//         console.log("更新之后,onUpdated")
//     })
//     onBeforeUnmount(() => {
//         console.log("onBeforeUnmount, 清理定时器,销毁之前")
// })
//     onUnmounted(() => {
//         console.log("onUnmounted,销毁之后")
//     })
</script>

<template>
    <div>{{ count }}</div>
</template>